<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />

		<title></title>
		<link rel="stylesheet" href="css/base.css" />
		<link rel="stylesheet" href="css/elm.css" />
		<link rel="stylesheet" href="css/swiper.min.css" />
		<script type="text/javascript" src="js/swiper.min.js" ></script>
		<script type="text/javascript" src="js/jquery-3.1.1.min.js" ></script>
	</head>
	
	<body>
		
		<header style="background-color: orangered;width: 100%;height: 7rem;color: white;">
			<br />
			<p>东城区北京市政府&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span>昌平</span></p>
			<br />
			<input type="text" placeholder="搜索商家、商品" style="background: white;"/>
			<br />
			<br />
			<span>张良麻辣烫  烤肉饭  睡过觉  肯德基  珍珠奶茶  千层饼</span>
		</header>
		     <div class="swiper-container" style=" width: 100%;
      height: 13rem;">
				<div class="swiper-wrapper">
					<div class="swiper-slide"><img src="img/banner.png"/ style=" width: 100%;
      height: 13rem;"></div>
					<div class="swiper-slide"><img src="img/banner.png"/ style=" width: 100%;
      height: 13rem;"></div>
					<div class="swiper-slide"><img src="img/banner.png"/ style=" width: 100%;
      height: 13rem;"></div>
					<div class="swiper-slide"><img src="img/banner.png"/ style=" width: 100%;
      height: 13rem;"></div>
					<div class="swiper-slide"><img src="img/banner.png"/ style=" width: 100%;
      height: 13rem;"></div>
					
				</div>
				<div class="swiper-pagination"></div>
			</div>
			
	</body>
	
	<script>
		var myswiper = new Swiper(".swiper-container",{
				autoplay:1000,
	  		    loop:true,
	  		    pagination: '.swiper-pagination',
			})
	</script>
</html>
